<template>
	<view class="mainPage prescribe" :style="{'padding-top': `${$store.state.safeArea.top || 0}px`, 'padding-bottom': `${$store.state.safeArea.bottom || 0}px`}">
		<public-head :title="title"></public-head>
		<view class="box">
			<view class="box1">
				<view class="top">
					<view class="title">
						{{yizhuData.hospital_name != undefined ? yizhuData.hospital_name : ''}}处方笺
					</view>
					<view class="bianhao-box">
						<view class="bianhao">
							NO：{{yizhuData.order_sn}}
						</view>
						<view class="time">
							<!-- {{yizhuData.time}} -->
						</view>
					</view>
				</view>
				<view class="bottom" v-if="yizhuData.is_emergency!=1">
					<view class="info-list">
						<view class="info-item">
							宠物名字： <text>{{yizhuData.petname}}</text>
						</view>
						<view class="info-item">
							种族： <text>{{['其他', '猫', '狗'][yizhuData.race] || yizhuData.race}}</text>
						</view>
						<view class="info-item">
							年龄： <text>{{yizhuData.age}}</text>
						</view>
						<view class="info-item">
							性别： <text v-if="yizhuData.sex==0">母</text><text v-else>公</text>
						</view>
						<view class="info-item">
							体重： <text>{{yizhuData.weight}}kg</text>
						</view>
					</view>
				</view>
			</view>
			<view class="box2">
				<view class="title">
					诊断结果：
				</view>
				<view class="textarea-box">
					<textarea v-model="zhenduanjieguo" placeholder="请输入诊断" placeholder-style="font-size: 26rpx;color: #959595;" />
				</view>
				
				<view class="tianjia-box">
					<view class="pr">
						RP：
					</view>
					
				</view>
				
				<view class="yao-list">
					<view class="yao-item" v-for="(item,index) in yaoList" :key="index">
						<view class="name">
							{{item.drugs}}
							{{item.dr_model}}
						</view>
						<view class="liang">
							用法用量：{{item.explain}}
						</view>
						<view class="liang">
							备注：{{item.remarks}}
						</view>
						<view class="btn-box">
							<text class="shanchu" @click="shanchu(item.drugs_id,index)">
								删除
							</text>
							<text class="bianji" @click="bianji(item.drugs_id)">
								编辑
							</text>
						</view>
						<view class="shuliang">
							*{{item.number}}
						</view>
					</view>
				</view>
				
				<view class="add"   @click="add">+ 添加</view>
			</view>
		</view>
		<view class="bottombut">
			<button class="btnfs" @click="fasong">发送</button>
		</view>
		
		<u-popup class="u-popup nobgPopup" v-model="show" mode="bottom" >
			<view class="anniu-box"> 
				<view class="queren" @click="qeuren">确认</view>
				<view class="quxiao" @click="quxiao">取消</view>
			</view>
		</u-popup>
		
		<u-popup v-model="showadd" mode="bottom" border-radius="25" height="1216rpx" :closeable="true">
			<view style="background-color: #FFFFFF; height:1216rpx; padding: 104rpx 32rpx;">
				<view class="u-skeleton">
					<view class="box">
						<view class="box1">
							<view class="img">
								<image :src="yaoDetail.dr_img" mode=""></image>
							</view>
							<view class="info">
								<view class="name">
									{{yaoDetail.dr_name}}
									{{yaoDetail.dr_model}}
								</view>
								<view class="gongsi">
									{{yaoDetail.dr_brand}}
								</view>
								<view class="price">
									¥{{yaoDetail.dr_price}}
								</view>
							</view>
						</view>
						<!-- <view class="kong">
		
						</view> -->
						<view class="box2_1">
							<view class="shuliang-box">
								<view class="left">
									<image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/hua.png"
										mode=""></image>
									<text>购买数量（盒）</text>
								</view>
								<view class="right">
									<image @click="jianNum"
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/jian.png"
										mode=""></image>
									<text>{{number}}</text>
									<image @click="jiaNum(yaoDetail.dr_stock)"
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/jia.png"
										mode=""></image>
								</view>
							</view>
		
		
							<view class="yongfa-box">
								<view class="left">
									<image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/hua.png"
										mode=""></image>
									<text>药品用法</text>
								</view>
								<view class="right">
									<input type="number" v-model.trim="explain" placeholder="请输入数量"
										placeholder-style="color: #C7C3C3;font-size: 24rpx;" />
									<view class="wenben">次/
										<!-- <text v-if="riNum==1">日</text>
										<text v-if="riNum==2">周</text>
										<text v-if="riNum==3">月</text> -->
		
										<text class="shijian" :class="riNum==1?'active':''"  @click.stop="riTab(1)">每日</text>
										<text class="shijian" :class="riNum==2?'active':''"  @click.stop="riTab(2)" >每周</text>
										<text class="shijian" :class="riNum==3?'active':''"  @click.stop="riTab(3)">每月</text>
		
									</view>
		
		
									<!-- <image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/jiantou.png"
										mode=""></image> -->
								</view>
							</view>
		
							<view class="yongliang-box">
								<view class="left">
									<image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/hua.png"
										mode=""></image>
									<text>单次用量</text>
								</view>
								<view class="right">
									<input type="digit" v-model.trim="Num2" placeholder="请输入数量"
										placeholder-style="color: #C7C3C3;font-size: 24rpx;" />
									<view class="wenben" >
										<!-- <text v-if="pianNum==1">片</text>
										<text
											v-if="pianNum==2">包</text>
											<text v-if="pianNum==3">瓶</text> -->
											<text class="shijian" :class="pianNum==1?'active':''"  @click.stop="pianTab(1)">片</text>
											<text class="shijian" :class="pianNum==2?'active':''"  @click.stop="pianTab(2)" >包</text>
											<text class="shijian" :class="pianNum==3?'active':''"  @click.stop="pianTab(3)">瓶</text>
											
											/次</view>
											
											
											
											
									<!-- <image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/jiantou.png"
										mode=""></image> -->
								</view>
							</view>
		
							<view class="banfa-box">
								<view class="left">
									<image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/hua.png"
										mode=""></image>
									<text>使用办法</text>
								</view>
								<view class="right">
									<view class="wenben" >
										<!-- <text v-if="neiNum==1">内服</text><text
											v-if="neiNum==2">外用</text>
											<text v-if="neiNum==3">注射</text> -->
											
											<text class="shijian" :class="neiNum==1?'active':''"  @click.stop="neiTab(1)">内服</text>
											<text class="shijian" :class="neiNum==2?'active':''"  @click.stop="neiTab(2)" >外用</text>
											<text class="shijian" :class="neiNum==3?'active':''"  @click.stop="neiTab(3)">注射</text>
											
											
											</view>
									<!-- <image
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/jiantou.png"
										mode=""></image> -->
								</view>
							</view>
		                        <view class="beizhu-box">
									<image style="width: 20rpx; display: inline-block;
									height: 20rpx;"
																	src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/hua.png"
																	mode=""></image>
		                        	<view class="title">
		                        		用法用量
		                        	</view>
		                        	<textarea v-model.trim="explain" placeholder="请输入用法用量"
		                        		 />
		                        </view>
								
							<view class="beizhu-box">
								<view class="title">
									备注
								</view>
								<textarea v-model.trim="remarks" placeholder="请输入药品的备注说明"
									placeholder-style="font-size: 32rpx;" />
							</view>
		
		
						</view>
					</view>
		
					
		
					
		
					<u-mask :show="show3" @click="show3 = false" :z-index="999">
						<view class="rizhouyue">
							<view class="item">
								<view class="left">
									内服
								</view>
								<view class="right" @click="neiTab(1)">
									<image v-if="neiNum==1"
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/xuanzhong.png"
										mode=""></image>
									<image v-else
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/weixuanzhong.png"
										mode=""></image>
								</view>
							</view>
							<view class="item">
								<view class="left">
									外用
								</view>
								<view class="right" @click="neiTab(2)">
									<image v-if="neiNum==2"
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/xuanzhong.png"
										mode=""></image>
									<image v-else
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/weixuanzhong.png"
										mode=""></image>
								</view>
							</view>
							<view class="item">
								<view class="left">
									注射
								</view>
								<view class="right" @click="neiTab(3)">
									<image v-if="neiNum==3"
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/xuanzhong.png"
										mode=""></image>
									<image v-else
										src="https://swl-1304532176.cos.ap-guangzhou.myqcloud.com/chongesheng_doctor/icon/weixuanzhong.png"
										mode=""></image>
								</view>
							</view>
						</view>
					</u-mask>
		
		
					<view class="btn-box">
						<view class="btn" @click="shiyong">
							使用
						</view>
					</view>
				</view>
		
			</view>
		</u-popup>
	</view>
</template>

<script>
	var that
	import publicHead from "@/components/publicHead/publicHead.vue"
	import { mapState } from 'vuex'
	export default {
		components: {
			publicHead
		},
		data() {
			return {
				title: '开处方',
				show: false,
				zhenduanjieguo:"",  //诊断结果
				drugs_id:"",
				boxHeight:"",
				yizhuData:"",
				leixing:2,
				showadd:false,
				
				title: '编辑用量',
				number:1,
				show1: false,
				riNum:1,
				show2:false,
				pianNum:1,
				show3:false,
				neiNum:1,
				explain:"",
				Num2:"",
				remarks:"",
				yaoDetail:"",
				modify:0
				
			}
		},
		computed:{
			...mapState(['yaoList'])
		},
		onLoad(options) {
			that=this
			// const value = JSON.parse(uni.getStorageSync('yaoList'));
			// that.yaoList=[...value]
			// console.log(that.yaoList,999)
			// console.log();
			 console.log(that.yaoList,999999)
			 
			 
			 
			 that.postData(JSON.parse(options.item))
		},
		methods: {
			shanchu(drugs_id){
				that.show=true
				that.drugs_id=drugs_id
			},
			qeuren(){
				console.log("确认")
				that.show=false
				for(var i=0;i<that.$store.state.yaoList.length;i++){
					if(that.$store.state.yaoList[i].drugs_id==that.drugs_id){
						that.$store.state.yaoList.splice(i,1)
					}
				}
			},
			quxiao(){
				that.show=false
			},
			bianji(drugs_id){
				that.showadd=true
				that.drugs_id=drugs_id
				that.editdrugs(drugs_id)
				
				for(var i=0;i<that.$store.state.yaoList.length;i++){
					if(that.$store.state.yaoList[i].drugs_id==that.drugs_id){
						that.explain=that.$store.state.yaoList[i].explain
						console.log('that.explain=that.$store.state.yaoList[i].explain',that.explain,that.$store.state.yaoList[i].explain)
						that.Num2=that.$store.state.yaoList[i].Num2
						that.remarks=that.$store.state.yaoList[i].remarks
						that.number=that.$store.state.yaoList[i].number
						that.neiNum=that.$store.state.yaoList[i].neiNum
						that.pianNum=that.$store.state.yaoList[i].pianNum
						that.riNum=that.$store.state.yaoList[i].riNum
						that.dr_model=that.$store.state.yaoList[i].dr_model
						that.dr_specifications=that.$store.state.yaoList[i].dr_specifications
						that.drugs=that.$store.state.yaoList[i].drugs
					}
				}
				
				
				// uni.navigateTo({
				// 	url:"./editDosage?yaoId="+yaoId +'&leixing=' + 2
				// })
			},
			
			
			editdrugs(){
				that.$postAjax1('Doctorsside_drugs_info',{
					drugs_id:that.drugs_id,
				},function(data){  //https://ask.suoweilai.com/Doctorsside_drugs_info  医生端-药品 - 医生端-医生药品详情
					that.yaoDetail=data.data.data
					
					// console.log(data.data.data,99999999999)
				})
			},
			jianNum(){
				if(that.number==1){
					return
				}
				that.number--
			},
			jiaNum(dr_stock){
				if(that.number>=dr_stock){
					uni.showToast({
						title: '数量超出范围~~',
						icon:'none',
						duration: 2000
					});
					
					return
				}
				that.number++
			},
			
			meiri(){
				that.show1=true
			},
			ci(){
				that.show2=true
			},
			xuanze(){
				that.show3=true
			},
			riTab(num) {
				that.riNum = num
				
				console.log('riNum日周月',that.riNum)
				that.show1 = false
			},
			pianTab(num) {
				that.pianNum = num
				if(num==1){
					console.log('片',that.pianNum)
				}
				if(num==2){
					console.log('包',that.pianNum)
				}
				if(num==3){
					console.log('瓶',that.pianNum)
				}
				that.show2 = false
			},
			neiTab(num) {
				that.neiNum = num
				that.show3 = false
			},
			
			shiyong(){
				if(that.explain==""){
					uni.showToast({
						icon:"none",
						title:"用法用量不能为空!"
					})
					return
				}
				// if(that.Num2==""){
				// 	uni.showToast({
				// 		icon:"none",
				// 		title:"单次用量不能为空!"
				// 	})
				// 	return
				// }
				
				var  datas = [
					{
						drugs_id:that.drugs_id,
						drugs:that.yaoDetail.dr_name,
						dr_model:that.yaoDetail.dr_model,
						number:that.number,
						explain:that.explain,
						Num2:that.Num2,
						riNum:that.riNum,
						pianNum:that.pianNum,
						neiNum:that.neiNum,
						remarks:that.remarks,
						dr_specifications:that.dr_specifications
					}
				]
				
				if(that.leixing==1){
					for(var i=0;i<that.$store.state.yaoList.length;i++){
						if(that.$store.state.yaoList[i].drugs_id==that.drugs_id){
							uni.showToast({
								icon:"none",
								title:"处方里有当前药品,不能重复添加!"
							})
							that.showadd=false
							return
						}
					}
					that.$store.state.yaoList=that.$store.state.yaoList.concat(datas)
					console.log(that.$store.state.yaoList,'leixing==1')
				}
				
				if(that.leixing==2){
					for(var i=0;i<that.$store.state.yaoList.length;i++){
						if(that.$store.state.yaoList[i].drugs_id==that.drugs_id){
							console.log('leixing==2',that.drugs_id)
					that.$store.state.yaoList.splice(i,1,datas[0])
				    
						}
					}
					console.log('leixing==2')
				}
				
				// const value = JSON.parse(uni.getStorageSync('yaoList'));
				// uni.setStorageSync('yaoList', JSON.stringify(datas.concat(value)));
				
				console.log(that.$store.state.yaoList,88888)
				
				
				// uni.navigateBack({
				//     delta: parseInt(that.cengNum)
				// });
				that.showadd=false
				// this.$nextTick(() => {
					
				// });
			},
			
			postData(item){
				that.$postAjax1('Doctorsside_blockmedical_advice',{
					order_sn:item.order_id
				},function(data){  //https://ask.suoweilai.com/Doctorsside_blockmedical_advice  医生端接诊 - 接诊-点击开医嘱或处方页面数据显示
					that.yizhuData=data.data.data
					// console.log(data.data.data,99999999999)
				})
			},
			fasong(){
				if(that.zhenduanjieguo == ''){
				uni.showToast({
					title: '请输入诊断结果',
					icon: 'none',
					duration: 1500
				});
				return
				}
				let boxHeight = ''
				uni.getSystemInfo({   //获取navigation返回高度 计算tab定位高度
					success(res) {
						let boxHeight1 = uni.createSelectorQuery().select(".box");
							boxHeight1.boundingClientRect(function(data) { //data - 各种参数
							console.log(data,9989)
							boxHeight=data.height
							// return
							var rps = []
							var drugs_array = []
							for(var i=0;i<that.$store.state.yaoList.length;i++){
								let item = that.$store.state.yaoList[i]
								let text1 = item.neiNum==1 ? '内服' : (item.neiNum == 2 ? '外用' : '注射')
								let text2 = item.riNum==1 ? '日' : (item.riNum == 2 ? '周' : '月')
								let text3 = item.pianNum==1 ? '片' : (item.pianNum == 2 ? '包' : '瓶')
								let text =item.explain
								let temp = {
									drugs_id:item.drugs_id,
									drugs:item.drugs,
									number:item.number,
									explain:text,
									remarks:item.remarks,
									dr_specifications:item.dr_specifications?item.dr_specifications:'',
									dr_model:item.dr_model?item.dr_model:''
								}
								console.log(text);
								drugs_array.push(temp)
								rps.push(item.drugs_id)
							}
							console.log(drugs_array);
							console.log(rps);
							that.$postAjax1('Doctorsside_prescription',{
								order_sn:that.yizhuData.order_sn,  //当前点击的订单编号
								user_id:that.yizhuData.user_id,     //用户ID
								hospital_id:that.yizhuData.hospital_id == undefined ? '' : that.yizhuData.hospital_id,     //医院ID
								// inquiry_method:that.yizhuData.consultation_type,     //问诊的方式
								pets_id:that.yizhuData.pets_id,       //宠物ID
								pets_result:that.zhenduanjieguo,    //诊断结果
								rps:JSON.stringify(rps),//药品ID ['1,2,3,4'] 字符串格式
								drugs_array:JSON.stringify(drugs_array),            //药品详细信息
								html_height:parseInt(boxHeight),    //页面内容所有信息显示的总高度
							},function(data){  //https://ask.suoweilai.com/Doctorsside_prescription  医生端接诊 - 接诊-开处方添加数据
								// console.log(data.data.data,99999999999)
								
								uni.navigateBack({
									delta:1
								})
								that.$store.state.yaoList = []
							})
			　　   }).exec()
					}
				})
			},
			add(){
				uni.navigateTo({
					url:'addDrugs?modify='+that.modify
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.u-skeleton{
		.box1{
			padding: 20rpx 32rpx;
			display:flex;
			.img{
				image{
					display: block;
					width: 120rpx;
					height: 132rpx;
				}
				margin-right: 12rpx;
			}
			.info{
				.name{
					font-size: 28rpx;
					font-weight: 500;
					color: #333333;
					line-height: 40rpx;
					margin-bottom: 14rpx;
				}
				.gongsi{
					font-size: 24rpx;
					font-weight: 400;
					color: #939499;
					line-height: 30rpx;
					margin-bottom: 14rpx;
				}
				.price{
					font-size: 28rpx;
					font-weight: 400;
					color: #DC1B31;
					line-height: 26rpx;
				}
			}
		}
		.kong{
			width: 100%;
			height: 12rpx;
			background: #F6F6F6;
		}
		.box2_1{
			.shuliang-box{
				padding: 24rpx 32rpx;
				border-bottom: 2rpx solid rgba(0,0,0,0.08);
				display: flex;
				justify-content: space-between;
				align-items: center;
				.left{
					image{
						display: inline-block;
						width: 20rpx;
						height: 20rpx;
						vertical-align: middle;
						margin-right: 20rpx;
					}
					text{
						font-size: 28rpx;
						font-weight: 400;
						color: #333333;
						line-height: 40rpx;
						vertical-align: middle;
					}
				}
				.right{
					image{
						display: inline-block;
						width: 56rpx;
						height: 56rpx;
						vertical-align: middle;
					}
					text{
						font-size: 28rpx;
						font-weight: 400;
						color: #343434;
						line-height: 40rpx;
						padding: 0 30rpx;
						vertical-align: middle;
					}
				}
			}
			.yongfa-box,.yongliang-box,.banfa-box{
				padding: 24rpx 0rpx 24rpx 32rpx;
				border-bottom: 2rpx solid rgba(0,0,0,0.08);
				display: flex;
				justify-content: space-between;
				align-items: center;
				display: none;
				.left{
					image{
						display: inline-block;
						width: 20rpx;
						height: 20rpx;
						vertical-align: middle;
						// margin-right: 20rpx;
					}
					text{
						font-size: 28rpx;
						font-weight: 400;
						color: #333333;
						line-height: 40rpx;
						vertical-align: middle;
					}
				}
				.right{
					input {
						width: 120rpx;
						height: 42rpx;
						// border-radius: 4rpx;
						// border: 2rpx solid rgba(0, 0, 0, 0.08);
						// padding-left: 18rpx;
						box-sizing: border-box;
						vertical-align: middle;
						display: inline-block;
					
						font-size: 24rpx;
						font-weight: 400;
						color: #333;
					}
					.wenben{
						display: inline-block;
						font-size: 28rpx;
						font-weight: 400;
						color: #242424;
						line-height: 40rpx;
						padding: 0 6rpx 0 12rpx ;
						vertical-align: middle;
						.shijian{
							padding:6rpx 20rpx ;
							border: 2rpx solid #DCDCDC;
							border-radius: 12rpx;margin: 0 4rpx;
							font-size: 26rpx;
						    color: #909090;
						}
						.active{
						      color: #FFFFFF;
							  background: -webkit-linear-gradient( #FFC347 ,#FF9331 );
							  
						}
					}
					image{
						display: inline-block;
						width: 14rpx;
						height: 20rpx;
						vertical-align: middle;
					}
				}
			}
		
			.beizhu-box {
				padding: 0 32rpx;
			
				.title {
					padding: 28rpx 0 20rpx 10rpx;
					font-size: 32rpx;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;
					display: inline-block;
				}
				textarea {
					width: 100%;
					box-sizing: border-box;
					height: 224rpx;
					// border-radius: 12rpx;
					// border: 2rpx solid #F6F6F6;
					font-size: 32rpx;
					font-weight: 400;
					padding: 24rpx 28rpx;
					line-height: 36rpx;
					color: #959595;
				}
				
			}
		}
		.rizhouyue{
			width: 376rpx;
			height: 284rpx;
			background: #FFFFFF;
			border-radius: 12rpx;
			position: absolute;
			top: 418rpx;
			left: 212rpx;
			// z-index: 9999;
			.item{
				padding: 26rpx 40rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-bottom: 2rpx solid rgba(0,0,0,0.08);
				&:nth-last-of-type(1){
					border: none;
				}
				.left{
					font-size: 28rpx;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;
					vertical-align: middle;
				}
				.right{
					image{
						display: inline-block;
						width: 34rpx;
						height: 34rpx;
						vertical-align: middle;
					}
				}
			}
		}
		
		.btn-box{
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			padding: 0 32rpx 100rpx;
			.btn{
				width: 100%;
				height: 98rpx;
				background: linear-gradient(219deg, #FF9331 0%, #FE7600 100%);
				border-radius: 8rpx;
				font-size: 36rpx;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 98rpx;
				text-align: center;
			}
		}
	}
	.box{
		padding-bottom: 200rpx;
		.box1{
			margin-top: 18rpx;
			padding: 0 32rpx;
			background-color: #FFFFFF;
			// margin-bottom: 16rpx;
			.top{
				border-bottom: 2rpx solid rgba(0,0,0,0.08);
				.title{
					padding: 12rpx 0 14rpx;
					font-size: 32rpx;
					font-weight: 500;
					color: #343434;
					line-height: 44rpx;
					text-align: center;
				}
				.bianhao-box{
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-bottom: 12rpx;
					.biaohao{
						font-size: 26rpx;
						font-weight: 400;
						color: #A3A3A3;
						line-height: 36rpx;
					}
					.time{
						font-size: 24rpx;
						font-weight: 400;
						color: #A3A3A3;
						line-height: 34rpx;
					}
				}
			}
			.bottom{
				.info-list{
					margin-top: 22rpx;
					display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
					.info-item{
						width: 60%;
						font-size: 28rpx;
						font-weight: 400;
						color: #959595;
						line-height: 40rpx;
						margin-bottom: 28rpx;
						&:nth-of-type(2n){
							width: 40%;
						}
						text{
							font-size: 26rpx;
							font-weight: 400;
							color: #242424;
							line-height: 36rpx;
						}
					
					}
				}
			}
		}
		.box2{
			width: 100%;
			padding: 0 32rpx;
			background: #FFFFFF;
			padding-bottom: 50rpx;
			.title{
				font-size: 28rpx;
				font-weight: 400;
				color: #242424;
				line-height: 40rpx;
				padding: 22rpx 0 16rpx;
			}
			.textarea-box{
				margin-bottom: 24rpx;
				textarea{
					box-sizing: border-box;
					width: 100%;
					height: 224rpx;
					border-radius: 12rpx;
					border: 2rpx solid #F6F6F6;
					padding: 24rpx 28rpx;
					
					font-size: 26rpx;
					font-weight: 400;
					color: #333;
					line-height: 36rpx;
					border-radius: 12rpx;
				}
			}
			.tianjia-box{
				display: flex;
				justify-content: space-between;
				padding-bottom: 30rpx;
				.pr{
					font-size: 28rpx;
					font-weight: 400;
					color: #242424;
					line-height: 40rpx;
				}
				.tianjia{
					background: linear-gradient(223deg, #FF9331 0%, #FE7600 100%);
					border-radius: 8rpx;
					font-size: 24rpx;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 34rpx;
					padding: 12rpx 36rpx;
				}
			}
			.add {
				padding: 16rpx 36rpx;
				// background: linear-gradient(270deg, #FF9331 0%, #FE7600 100%);
				border-radius: 40rpx;
				font-size: 34rpx;
				color: #FE7600;
				border: 1px #FE7600 dashed;
				margin-top: 50rpx;
				width: 100%;
				text-align: center;
				
			}
		
			.yao-list{
				.yao-item{
					padding: 40rpx 0 20rpx;
					// border-bottom: 2rpx solid rgba(0,0,0,0.08);
					border-bottom: 3rpx #e8e8e8 solid;
					position: relative;
					&:nth-of-type(1){
						padding: 0 0 20rpx;
					}
					// &:nth-last-of-type(1){
					// 	border-bottom:none
					// }
					.name{
						font-size: 26rpx;
						font-weight: 500;
						color: #343434;
						line-height: 36rpx;
						margin-bottom: 12rpx;
						width: 90%;
						white-space: nowrap;
						    text-overflow: ellipsis;
						    overflow: hidden;
					}
					.liang{
						font-size: 24rpx;
						font-weight: 400;
						color: #919398;
						line-height: 38rpx;
					}
					.btn-box{
						text-align: right;
						.shanchu{
							font-size: 24rpx;
							font-weight: 400;
							color: #FFFFFF;
							line-height: 34rpx;
							padding: 6rpx 36rpx ;
							background: #CCCCCC;
							border-radius: 23rpx;
						}
						.bianji{
							font-size: 24rpx;
							font-weight: 400;
							color: #FFFFFF;
							line-height: 34rpx;
							padding: 6rpx 36rpx;
							background: linear-gradient(223deg, #FF9331 0%, #FE7600 100%);
							border-radius: 23rpx;
							margin-left: 24rpx;
						}
					}
					.shuliang{
						position: absolute;
						top: 22rpx;
						right: 0;
						font-size: 30rpx;
						font-weight: 400;
						color: #908d8d;
						line-height: 34rpx;
					}
				}
			}
		}
	}
	.u-popup{
		.anniu-box{
			background-color: transparent;
			padding:0  22rpx 0rpx;
			// margin-bottom: 50rpx;
			padding-bottom: 50rpx;
			.queren{
				width: 100%;
				height: 106rpx;
				background: #EFEFEF;
				border-radius: 12rpx;
				text-align: center;
				font-size: 32rpx;
				font-weight: 400;
				// color: #E02020;
				line-height: 106rpx;
				margin-bottom: 16rpx;
			}
			.quxiao{
				width: 100%;
				height: 106rpx;
				background: #EFEFEF;
				border-radius: 12rpx;
				text-align: center;
				font-size: 32rpx;
				font-weight: 400;
				line-height: 106rpx;
				// color: #2F78F3;
			}
		}
		
	}
	
	.bottombut{
		background-color: #FFFFFF;
		position: fixed;
		padding: 30rpx 0 50rpx 0;
		width: 100%;
		bottom: 0;
		.btnfs{
			background: #FF8F2B; 
			box-shadow: 0px 6rpx 8rpx 0px rgba(255, 143, 43, 0.2);
			border-radius: 46rpx; line-height: 84rpx;
			font-size: 32rpx;
			color: #FFFFFF; width: 80%;
		}
	}
</style>


